<!-- 
    新建/edit/confirm 资产配置

    此页面有多个入口：
        1-资产配置列表页 - 新建资产配置按钮 type=add
        2-资产配置列表页 - 编辑 type=edit
        3-资产配置列表页 - 确认 type=confirm
        4-客户详情页 - 资产配置按钮 type=cus

    所有表单容器 都加上 formSection class

    资产配置表单逻辑：

    第一步表单：

        新建/编辑 都用addAssete.vue，

        确认信息 用

        进入页面：
            1-如果是新建且第一次从列表进入，不需要请求回显数据的接口
              如果是新建、编辑，第一次从列表进入，需要请求回显数据的接口
                  切换步骤，原组件保存，不再次请求回显数据
            2-需要请求字典值接口
            3-如果请求了回显接口，有回显的客户数据，看是否需要请求客户接口（拿到此客户相关的其他数据），有可能是需要请求的

        选择客户：
            1- 可能需要选择客户后，看是否需要请求客户接口（拿到此客户相关的其他数据），有可能是需要请求的（不确定）

    
    第二步、第三步表单：
        填完提交：
            1- 隐藏的画图逻辑：提交表单数据给后台后，需要请求画图数据的接口，画图然后把图传给后台
-->
<template>
    <div class="assetStep addAsset">
        
        <!-- 页面title -->
        <page-title :title="title" :clickRightButton="clickExplain" :backUrl="backUrl"></page-title>


        <!-- 进度条 -->
        <steps :stepList="stepList" :step="step" @changeToSteps = 'changeToSteps'></steps>

        
        <!-- 每块表单的区域 -->

        <!-- 确认 第一步-->
        <infoConfirme v-if="step==1 && type=='confirm'"></infoConfirme>

        <!-- 新建、编辑第一步 -->
        <addAsset v-if="step==1 && type!='confirm'"></addAsset>

        <questionnaireSure v-if="step==2"></questionnaireSure>

        <assetNow v-if="step==3"></assetNow >
        
    </div>
</template>

<style>
    .formSection{
        margin-top: 10px;
    }
</style>

<script>

import '@src/common/less/button.less'
import '@src/common/components/form/form.less'

export default {
    name: "zcpzStep",

    components:{

        //头部导航
        pageTitle: resolve => require(['@src/common/pageTitle/pageTitle'],resolve),

        //进度条
        steps: resolve => require(['@src/common/components/steps/steps'],resolve),

        //确认资产配置
        infoConfirme: resolve => require(['@src/lgb/zcpz/pages/informationConfirme/informationConfirme'],resolve),

        //新建资产配置
        addAsset: resolve => require(['@src/lgb/zcpz/pages/addAsset/addAsset'],resolve),

        //问卷
        questionnaireSure: resolve => require(['@src/lgb/zcpz/pages/questionnaireSure/questionnaireSure'],resolve),

        //资产配置现状
        assetNow: resolve => require(['@src/lgb/zcpz/pages/assetNow/assetNow'],resolve),
    },

    data() {
        return {

        	//点返回按钮
        	backUrl: null,

            //进度条配置
            stepList:[
                    { title: '信息确认', active: true },
                    { title: '问卷确认' },
                    { title: '填写资产配置现状' },
                    { title: '编辑预览' },
                    { title: '报告生成' }
            ],
            
            // 步骤进度数，默认为1
            step: 1,

            //默认设置为第一个页面的
            title: '新建资产配置',

            type: this.$route.query.type
        }
    },

    mounted() {
        
        if( !this.$route.query.isSkip ){
            this.backUrl = goUrl.zcpzAssetList
        }
    },
    methods: {

        //修改当前进度
        changeToSteps( num ) {

            console.log(num)

            this.step = num

            // this.$refs.steps.changeStep(num);
        },

        clickExplain(){
            
        }
    }
};
</script>